<template>
  <div class="panel-container">
    <action-node v-for="(node, index) in actionNodes" :key="index" :node="node"
                 @mousedown="startDrag(node)"/>
  </div>
</template>
<script setup>
import ActionNode from "@/components/logic-editor/node-panel/action-node/index.vue";
import {NODE_TYPE} from "@/components/logic-editor/constant";

defineOptions({
  name: 'NodePanel'
})
const props = defineProps({
  lf: Object
});
const actionNodes = [
  {
    type: NODE_TYPE.REQUEST,
    text: '数据请求',
  },
]
const startDrag = (item) => {
  props.lf.dnd.startDrag({
    type: item.type,
  })
}
// console.log('setup node panel', props.lf);
onMounted(() => {
  // console.log('node panel mounted', props.lf);
})
</script>

<style scoped>
.panel-container {
  padding: 10px 0 10px 0;
  height: 700px;
  width: 10%;
  display: flex;
  flex-direction: column;
  align-items: center;
  border: #CCCCCC 1px solid;
}
</style>
